<!DOCTYPE html>
<html lang="zh" class="scroll-smooth">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><%= title %> - <%= site.title %></title>
    <link rel="icon" href="<%= basePath %>/<%= site.favicon || '/favicon.ico' %>" type="image/x-icon">

    <!-- 基础样式文件 -->
    <link rel="stylesheet" href="/assets/pageforge.min.css">

    <!-- 加载主题配置中的额外 CSS 文件 -->
    <% if (site.theme && site.theme.extsite.ra_css && Array.isArray(theme.extra_css)) { %>
        <% site.theme.extra_css.forEach(function(css_path) { %>
            <link rel="stylesheet" href="<%= css_path %>">
        <% }); %>
    <% } %>

    <!-- Tailwind CSS -->
    <script src="<%= locals.cdn?.style || 'https://cdn.tailwindcss.com' %>"></script>
</head>

<body class="min-h-screen bg-white dark:bg-gray-900 text-gray-900 dark:text-gray-100">
<div class="flex flex-col min-h-screen">
    <% if (page.config && page.config.header !== false) { %>
        <%- include('../includes/header') %>
    <% } %>

    <div class="container mx-auto px-4 py-8 flex-grow flex pt-16">
        <!-- 左侧列表 -->
        <% if (page.config && page.config.sidebar !== false) { %>
            <aside class="w-64 flex-shrink-0 pr-8">
                <nav class="sticky top-20">
                    <div class="space-y-4">
                        <%- include('../includes/sidebar') %>
                    </div>
                </nav>
            </aside>
        <% } %>

        <!-- 中间内容 -->
        <main class="flex-grow mt-6 w-2">
            <article class="prose dark:prose-invert lg:prose-lg mx-auto">
                <%- include(`../layouts/${page.layout || 'content'}`) %>
            </article>
        </main>

        <!-- 右侧目录 -->
        <% if (page.config && page.config.toc !== false && page.toc.length > 0) { %>
            <%- include('../includes/toc') %>
        <% } %>
    </div>

    <% if (page.config && page.config.footer !== false) { %>
        <%- include('../includes/footer') %>
    <% } %>
</div>
</body>

<!-- 基础脚本文件 -->
<script src="/assets/pageforge.min.js"></script>

<!-- 加载主题配置中的额外 JS 文件 -->
<% if (locals.theme?.extra_js && Array.isArray(theme.extra_js)) { %>
    <% theme.extra_js.forEach(function(js_path) { %>
        <script src="<%= js_path %>"></script>
    <% }); %>
<% } %>
</html>